<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="box">
			<p><input type="text" name="" v-model="name" id="" value="" /></p>
			<p>
				<input type="radio" name="" id="" v-model="sex" value="男" />男
				<input type="radio" name="" id="" v-model="sex" value="女" />女
			</p>
			<p>
				<select v-model="school">
					<option value="中国矿业大学">中国矿业大学</option>
					<option value="北京大学">北京大学</option>
				</select>
			</p>
			<p>
				<button v-show="submitBtnDisplay">提交</button>
			</p>
		</div>
	</body>
</html>
<script type="text/javascript">
	function Vue(options) {
		this._data = options.data;
		Object.keys(this._data).forEach(key => {
			Object.defineProperty(this, key, {
				get() {
					return this._data[key];
				},
				set(newVal) {
					console.log(key + "的值发生变化")
					document.querySelector("input[v-model='name']").value = newVal;
					this._data[key] = newVal;
					// 这里可以添加更新逻辑，如通知依赖进行更新等。
				}
			});
		});
		let self = this;
	}

	class Aue {
		constructor(options) {
			this._data = options.data;
			Object.keys(this._data).forEach(key => {
				Object.defineProperty(this, key, {
					get() {
						return this._data[key];
					},
					set(newVal) {
						console.log(key + "的值发生变化")
						this._data[key] = newVal;
						// 这里可以添加更新逻辑，如通知依赖进行更新等。
					}
				});
			});
		}

		setName(name) {
			this._data.name = name;
		}
	}
	var d = {
		data: {
			name: "李飞飞"
		},
		methods: {
			getname() {

			}
		}
	};
	var aue = new Aue(d);
</script>
